<template>
    <div>
        <h3>添加房号</h3>
        <table class="table table-bordered">
            <tbody>
                <tr>
                    <td align="right">房型:</td>
                    <td>
                        <select v-model="houseNO.HouseTypId">
                            <option value="">请选择</option>
                            <option :value="item.Id" v-for="item in data.list">{{ item.HouseTypeName }}</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td align="right">房间号码:</td>
                    <td>
                        <input type="text" v-model="houseNO.HouseNoName">
                    </td>
                </tr>
                <tr>
                    <td align="right">房号描述:</td>
                    <td>
                       <textarea cols="40" rows="5" v-model="houseNO.Detail"></textarea>
                    </td>
                </tr>
                <tr>
                    <td align="right">状态:</td>
                    <td>
                        <input type="radio" name="state" :value="1" v-model="houseNO.State">上架
                        <input type="radio" name="state" :value="0" v-model="houseNO.State">下架
                    </td>
                </tr>
                <tr>
                    <td align="right"></td>
                    <td>
                        <input type="button" value="添加" class="btn btn-primary" @click="Add">
                    </td>
                </tr>
            </tbody>
        </table>
        <!--考试完毕-->
    </div>
</template>

<script setup lang="ts">

import { ref, reactive, onMounted, renderSlot } from 'vue'
import { useRoute, useRouter } from 'vue-router'
import axios from 'axios';

const route = useRoute();
const router = useRouter();

onMounted(() => {
    GetHosueType();
})

let data: any = reactive({
    list: [],
})

let queryInfo = reactive({
    pageIndex: 1,
    pageSize: 1000,

})

let houseNO = reactive({

    "HouseNoName": "",
    "HouseTypId": "",
    "Detail": "",
    "State": 1,
})

const GetHosueType = () => {
    axios({
        method: "get",
        url: "/api/House/ShowHouseType",
        params: queryInfo
    })
        .then(res => {
            Object.assign(data, res.data);
            console.log(res);

        })
        .catch(err => {
            console.log(err);

        })
}
const Add = () => {
    if(houseNO.HouseTypId===""){
        alert("房型必选");
        return;
    }
    if(houseNO.HouseNoName===""){
        alert("房号不能为空");
        return;
    }
    if(houseNO.Detail===""){
        alert("房间描述不能为空");
        return;
    }

    axios({
        method: "post",
        url: "/api/House/AddHouseNO",
        data: houseNO
    })
        .then(res => {
            if (res.data == -1) {
                alert("房号名称已存在")
            }
            else if (res.data > 0) {
                alert("添加成功")
                router.push("/houseNoList")
            }
            else {
                alert("添加失败")
            }
            console.log(res);

        })
        .catch(err => {
            console.log(err);

        })
}

</script>

<style scoped></style>